<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="style.css" rel="stylesheet"  media="all" type="text/css" />
<title>原神</title>
</head>
<body>
<header class="head">
  <div class="main"><span class="fl"><img src="https://img1.baidu.com/it/u=2837266391,3441220502&fm=253&fmt=auto&app=138&f=PNG?w=183&h=134.png" width="100"/></span>
    <p class="clear"></p>
  </div>
</header>
<nav class="menu">
  <div class="main">
  <ul id="list">
    <li>
        <a href="1.html">登录</a>
        <ul id="u1">
            <li><a href="#">注册</a></li>
        </ul>
    </li>
    <li>
        <a href="2.html">角色</a>
    </li>
    <li>
        <a href="3.html">剧情</a>
    </li>
    <li>
        <a href="index.html">首页</a>
    </li>
  </ul>
  </div>
</nav>
<div class="main">
        <h2>
        人物信息:
    </h2>
    <h3>
        姓名：祝思远
    </h3>
    <h3>
        学号：2203288
    </h3>
    <h3>
        班级：软件13班
    </h3>
    <h2>
        网站介绍：
    </h2>
    <h3>
        名称：原神
    </h3>
    <h3>
        主题：对于一款喜欢的游戏的推荐
    </h3>
    <h3>
        原因：强烈推荐原神的美景和动听的音乐，去逛遍提瓦特大陆上每一片景色不逊于去旅游！
    </h3>
    <h2>
        网站设计：
    </h2>
    <h3>
一共设计了五个页面,分别是一个主网页，三个子网页和一个报告网页。
    </h3>
    <h3>
封面页最上面设计了一个原神的loge，然后写了一个二级导航栏，这个二级导航栏在大多数的子页面都会出现，方便随时跳转到想要的页面。这个导航栏只在“登录”上有二级效果。然后居中写了原神的宣传海报和介绍，再在下面排列了主要的角色。最后在页脚写了学习报告的超链接。
    </h3>
    <h3>
        在登录的子页面设计了一个登入的入口和一个侧边栏，侧边栏上有“首页”选项，保证了页面美观和随时跳转的功能。
    </h3>
    <h3>
        在角色的子页面采用了左图右文的形式来介绍角色形象和角色的来历和爱好，但由于时间关系没能把全部角色给写上去。
    </h3>
    <h3>
        在剧情的子页面上有一个视频，然后是大致剧情。ps：只写了一些，其他的当然是要玩家自己去探索阿。
    </h3>
    <h2>
        网站内容：
    </h2>
    <h3>
        用到的技术：html,CSS
    </h3>
    <h3>
        设计过程使用和借鉴的网站：w3school,CSDN,B站
    </h3>
    <h3>
        图片和视频的来源：百度，B站
    </h3>
    <h2>
        优点：
    </h2>
    <h3>
    整体上，网站的风格，颜色、字体等统一和谐 ，页面整洁，干净明了，使用方便。
    </h3>
    <h2>
        遇到的问题和不足：
    </h2>
    <h3>
        本来在B站学习和尝试过使用Javescript来美化网站，但是尝试了很多次都没效果，于是只好决定只使用html和css来写。网页大多比较粗糙，缺乏设计感，但奈何水平和时间有限，只能做到这种水准。
    </h3>
    <h2>
        总结：
    </h2>
    <h3>
        这次网站设计勉强达到了我的预期标准，但是没有特效等效果还是颇为遗憾，但也锻炼了我的设计和编程能力，让我对一些基础的代码和选择器的形式更加熟悉，摆脱了对3wschool的完全依赖。ps：不过有时候还是会忘。
    </h3>
    </div>
<footer class="end">
    <a href="学习报告.html">学习报告</a>
</footer>
</body>
</html>